<!--
 * @Author: wwssaabb
 * @Date: 2023-02-21 11:00:44
 * @LastEditTime: 2023-02-21 11:36:45
 * @FilePath: \Background blur\index.html
-->
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <link href="./css/style.css" rel="stylesheet" type="text/css" />

</head>

<body>
  <div class="container">
    <input style="margin:10px;" type="checkbox" placeholder="开启动画">
    <svg width="400px" height="400px">
      <circle 
        fill="none" 
        stroke="#68e534" 
        stroke-width="20" 
        cx="200" 
        cy="200" 
        r="190"
        class="circle"
        stroke-linecap="round"
        transform="rotate(-90,200,200)"
      />
      <polyline 
        fill="none" 
        stroke="#68e534" 
        stroke-width="24" 
        points="88,214 173,284 304,138" 
        stroke-linecap="round"
        stroke-linejoin="round"
        class="tick"
      >
    </svg>
    <h2>Success!</h2>
  </div>
  
</body>
</html>